<template>
  <div
    class="cardlist-item u-f mb8"
    v-for="(item, index) in list"
    :key="index"
    @click="$emit('onClick', item.id)"
  >
    <div class="image-box">
      <img v-default-img :src="$oss + item.cover" alt="" />
    </div>
    <div class="flex1 u-f u-f-fdc u-f-jsb ml12 ts">
      <div class="ft28 ellipsis-2 fb">{{ item.name }}</div>
      <div class="u-f u-f-jsb">
        <span class="ft24 ellipsis-1 flex1 date">{{
          `${item.startDate}`
        }}</span>
        <van-button round size="mini" type="primary">去报名</van-button>
      </div>
    </div>
  </div>
</template>

<script setup>
import { defineEmits } from 'vue'
defineProps({
  list: {
    type: Array,
    default() {
      return []
    }
  }
})
defineEmits(['onClick'])
</script>

<style scoped lang="scss">
.cardlist-item {
  @include cardListItem;
}
</style>
